// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
import './lib/mui/css/mui.min.css'
import 'mint-ui/lib/style.css'///mint-ui导入后需要手动导入css样式  否则不能出现效果
import './lib/mui/fonts/mui-icons-extra.ttf'
import { Header } from 'mint-ui'
import { Swipe, SwipeItem } from 'mint-ui';
import { Button } from 'mint-ui';
import { Lazyload } from 'mint-ui';
import ElementUI from 'element-ui';
import Element from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';///导入elementui，在这个项目中用用这个ui库只用到了数字选择器
///但是因为嫌麻烦  所以直接全部导入了  没有按需导入
import VueResource from 'vue-resource'
import moment from 'moment'
import VuePreview from 'vue-preview'

Vue.use(Element, { size: 'small', zIndex: 3000 });
// defalut install
Vue.use(VuePreview)

Vue.use(VueResource)
Vue.use(ElementUI);

Vue.use(Lazyload);
Vue.component(Swipe.name, Swipe);
Vue.component(SwipeItem.name, SwipeItem);
Vue.component(Button.name, Button);

Vue.component(Header.name, Header);
Vue.config.productionTip = false

///定义全局时间的过滤器
Vue.filter('dateFormat',function(dataStr,pattern = "YYYY-MM-DD HH:mm:ss"){
   return moment(dataStr).format(pattern)

})
Vue.http.options.emulateJSON = true;
///注册vuex
// 配置vuex
// 1 导入vue包
import Vuex from 'vuex'
Vue.use(Vuex)
///在页面跟新的时候直接将本地中的数据渲染到页面中去
var car = JSON.parse(localStorage.getItem('car'))

var store = new Vuex.Store({
  state:{
    ////这里用来存储数据
    car:car
  },
  mutations:{
    /////vm实例中外部方法 不能直接操作state中的数据，想法操作state中的数据必须要用mutations中所定义的方法
    addToCar(state,goodsInfo){
      ////加入到car中
      let flag = false
      state.car.some(item =>{
        if(item.id == goodsInfo.id){
          item.count = item.count + goodsInfo.count
          flag = true
          return true
        }
      })
      if(!flag){
        state.car.push(goodsInfo)

      }
      ////当car更新完成之后将car中的数据保存到本地页面存储中去
      localStorage.setItem("car",JSON.stringify(state.car))
    }
  },
  getters:{
    ////this.store.getters.****
    ////相当于计算属性
    ////未成功
    getAllCount(state){////用来将所有的count加起来
      let c = 0;
      state.car.forEach(item=>{
        c+=item.count
      })
      return c
      
    }

  }

})




/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  store,
  components: { App },
  template: '<App/>'
})
